<template>
  <div class="welfare-wrap">
    <van-nav-bar
      title="福利社"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
      fixed
    />
    <div class="img">
      <img src="../assets/image/welfare.png" alt="" />
    </div>
    <div class="footer">
      <van-tabbar fixed>
        <p>订阅 "优惠券领取" 提醒，有新券可领取时通知</p>
        <button @click="Subscription">我要订阅</button>
      </van-tabbar>
    </div>
  </div>
</template>

<script>
import { Toast } from "vant";
export default {
  setup() {
    const onClickLeft = () => history.back();
    const Subscription = () => {
      Toast.success("订阅成功");
    };
    return {
      onClickLeft,
      Subscription,
    };
  },
};
</script>

<style lang="less" scoped>
.welfare-wrap {
  img {
    padding: 30% 10% 10% 13%;
  }
  .footer {
    .van-tabbar {
      p {
        font-size: 13px;
        color: #4f4f4f;
        display: block;
        margin: 13px 10px;
        line-height: 25px;
      }
      button {
        height: 25px;
        width: 70;
        padding: 0 10px;
        background-color: #04c160;
        border: 0;
        border-radius: 5px;
        color: #fff;
        font-size: 13px;
        margin-top: 12px;
      }
    }
  }
}
</style>